<!DOCTYPE html>
<html lang="en">
<head>
     <meta name="viewport" content="width=device-width, initial-scale=1,minimum-scale=1,minimum-scale=1,user-scalable=yes">
     <meta charset="UTF-8">
     <script type="text/javascript" src="jscolor/jscolor.js"></script>
     <script type="text/javascript" src="haima.js"></script>
     <script type="text/javascript" src="jquery.js"></script>
     <script type="text/javascript" src="hammer.min.js"></script>
     <script type="text/javascript" src="bootstrap.min.js"></script>
     <link rel="stylesheet" href="bootstrap.min.css">
     <link rel="stylesheet" href="bootstrap-theme.min.css">
  <title>Document</title>
  <style type="text/css">
  .show-grid [class ^="col"] {
            /*padding-top: 10px;*/
            /*padding-bottom: 10px;*/
            background-color: #eee;
            border: 1px solid #ddd;
            background-color: rgba(86, 61, 124, .15);
            border: 1px solid rgba(86, 61, 124, .2);
            white-space: nowrap;
        }
  *{margin: 0;
    padding: 0;
  }
  #adv{
    /*background-image: url(invite.png);*/
    position: relative;
    background-repeat: no-repeat;
    width: 100%;
    height: 360px;
  }
  #btn1{
    border-radius: 40px;
    position: absolute;
    width: 125px;
    height:28px;
    left: 20px;
    bottom:98px;
    display: inline-block;
    background:#3CBF0E;
    border:none;
  }
  #btn2{
    border-radius: 40px;
    width: 125px;
    height:28px;
    bottom: 60px;
    left: 20px;
    position: absolute;
    display: inline-block;
    background: #F22469;
    border: none;
  }
  #bgImg{
    position: absolute;
    display: inline-block;
    right: 0px;
    height: 360px;
    width: 94%;
  }
  .sp1{ position: absolute;
    right: 17px;
    bottom: 3px;
    font-size: 18px;
    display: inline-block;
    color: white;
    letter-spacing: 1px;
  }
  .sp2{
    position: absolute;
    right: 4px;
    bottom: 3px;
    font-size: 18px;
    display: inline-block;
    color: white;
    letter-spacing: 1px;
  }
  .btn1Img{
    width: 25px;
    height: 25px;
    position: absolute;
    left: 3px;
    bottom: 0px;

  }
  .btn2Img{
    width: 20px;
    height: 20px;
    position: absolute;
    left: 3px;
    bottom: 4px;
  }
  #money22{
    font-size: 15px;
    color:#3D3D3D;
    width: 100%;
    height: 25px;
    background: #CCCCCC;
  }
  #one{
    width: 145px;
    white-space: nowrap;
    margin:auto;
    transform:translateY(2px);
    -webkit-transform:translateY(2px);
    /*margin-top: 5px;*/
    /*border: 1px solid #000;*/
  }
  #two{
    color:#F22469;
  }
  #phone{
    background: #F5F5F5;
    width: 100%;
    height: 250px;
    font-size: 14px;
  }
  .abc{
    white-space: nowrap;
  }
  .inner1{
    margin-left: 8px;
  }
   .inner2{
    margin-left: 10px;
  }
   .inner3{
    margin-left: 20px;
  }
  </style>
</head>
<body>
  <!-- <input type="text" class="color"> -->
  <div id="adv"><img src="invite.png" alt="" id="bgImg"><button id="btn1"><img src="weixin.png" class="btn1Img"><span class="sp1">微信好友</span></button><button id="btn2"><img src="friend.png" class="btn2Img"><span class="sp2">微信朋友圈</span></button></div>
  <div id="money22"><div id="one">您已获得<span id="two">5</span>元推荐奖励</div></div>
  <ul id="phone" class="container ">
  </ul>
  <script type="text/javascript">
  //
  var uid=api.getConfig("uid");
  try{
	api.ajax("http://ttmy.len.so/app/user/invitelist/uid/"+uid,"get","showInfo");
	//
}catch(e){
	//api.showToast(e);
	//api.log("costomerSrvice",e);
}


function showInfo(data){
  var phone=getId("phone");
	if(data!=null){
    api.log("invite",data);
		var info=eval('('+data+')');
    $.each(info, function(i, item) {
        api.log("invite",item.mobile);
        var listItem=create("div");
          listItem.className="row abc";
          listItem.style.height="30px";
          listItem.style.borderTop="solid 1px #ccc ";

          // listItem.style
          phone.appendChild(listItem);
          var span1=create("div");
          span1.style.marginTop="4px";
          span1.className="col-xs-4 ";
          listItem.appendChild(span1);
          var span1_inner=create("div");
          span1_inner.innerHTML=info[i].mobile;//invite2.notUser[i].phone;
          span1_inner.className="inner1";
          span1.appendChild(span1_inner);
          var span2=create("div");
          span2.style.marginTop="4px";
          span2.className="col-xs-4";
          listItem.appendChild(span2);
          var span2_inner=create("div");
          span2_inner.innerHTML="未使用天天美印";
          span2_inner.className="inner2";
          span2.appendChild(span2_inner);
          var span3=create("div");
          span3.style.marginTop="4px";
          span3.className="col-xs-4";
          listItem.appendChild(span3);
          var span3_inner=create("div");
          span3_inner.innerHTML="立即提醒";
          span3_inner.className="inner3";
          span3_inner.title=info[i].mobile;
          span3.appendChild(span3_inner);
     });
	}
	else{
		api.showToast('您还没有推荐的人');
	}
	
}
//api.log("bindEvent","1");
  function bindEvent () {
  //    api.log("bindEvent","11");
      try{
        var mc = new Hammer.Manager(document.body);
        mc.add(new Hammer.Tap());
    //    api.log("bindEvent","22");
        mc.on("tap", function (e) {
          
            var className=$(e.target).attr("class");
            //api.showToast(className);
              //api.log(className);
            api.clickShareBtn(className);
            if(className=="inner3"){
              try{
                if($(e.target).html()=="已提醒"){
                  return;
                }
                var phonenumber=$(e.target).attr("title");
                api.log("phonenumber",phonenumber);
                //var uid=api.getConfig("uid");
                try{
                  var sUrl="http://ttmy.len.so/app/user/sendsms/uid/"+uid+"/mobile/"+phonenumber;
                  //api.log("sUrl",sUrl);

                  api.ajax(sUrl,"get","sendSms");
                  $(e.target).html("已提醒");
                  //
                }catch(e){
                  //api.showToast(e);
                  //api.log("costomerSrvice",e);
                }

                //参数：mobile(提醒发送短信的手机号),uid(自己的ID)
                //http://ttmy.len.so/app/user/sendsms
              }
              catch(e){
                   api.log("error",e);
              }
                
            }
            
            
        });
      }
      catch(e){
        api.log("error2",e);
      }
      
    }
     //api.log("bindEvent","2");
  bindEvent();
    //api.log("bindEvent","3");
    function sendSms(data){
        api.log("sendSms",data);
    }
      //api.log("bindEvent","4");
  </script>
  
</body>
</html>